extends /default.pug

block view
  .animated.fadeIn
    .row
      .col-12
        .card
          .card-header
            strong Brand Buttons
            small Usage ex.
            code(style='text-transform:lowercase') <button class="btn btn-brand btn-facebook"><span>Facebook</span></button>
          .card-body
            h6
              | Size Small 
              small
                | Add this class 
                code .btn-sm
            p
              button.btn.btn-brand.btn-sm.btn-facebook(type='button', style='margin-bottom: 4px')
                i.fa.fa-facebook
                span Facebook
              button.btn.btn-brand.btn-sm.btn-twitter(type='button', style='margin-bottom: 4px')
                i.fa.fa-twitter
                span Twitter
              button.btn.btn-brand.btn-sm.btn-linkedin(type='button', style='margin-bottom: 4px')
                i.fa.fa-linkedin
                span LinkedIn
              button.btn.btn-brand.btn-sm.btn-flickr(type='button', style='margin-bottom: 4px')
                i.fa.fa-flickr
                span Flickr
              button.btn.btn-brand.btn-sm.btn-tumblr(type='button', style='margin-bottom: 4px')
                i.fa.fa-tumblr
                span Tumblr
              button.btn.btn-brand.btn-sm.btn-xing(type='button', style='margin-bottom: 4px')
                i.fa.fa-xing
                span Xing
              button.btn.btn-brand.btn-sm.btn-github(type='button', style='margin-bottom: 4px')
                i.fa.fa-github
                span Github
              button.btn.btn-brand.btn-sm.btn-html5(type='button', style='margin-bottom: 4px')
                i.fa.fa-html5
                span HTML5
              button.btn.btn-brand.btn-sm.btn-openid(type='button', style='margin-bottom: 4px')
                i.fa.fa-openid
                span OpenID
              button.btn.btn-brand.btn-sm.btn-stack-overflow(type='button', style='margin-bottom: 4px')
                i.fa.fa-stack-overflow
                span StackOverflow
              button.btn.btn-brand.btn-sm.btn-css3(type='button', style='margin-bottom: 4px')
                i.fa.fa-css3
                span CSS3
              button.btn.btn-brand.btn-sm.btn-youtube(type='button', style='margin-bottom: 4px')
                i.fa.fa-youtube
                span YouTube
              button.btn.btn-brand.btn-sm.btn-dribbble(type='button', style='margin-bottom: 4px')
                i.fa.fa-dribbble
                span Dribbble
              button.btn.btn-brand.btn-sm.btn-google-plus(type='button', style='margin-bottom: 4px')
                i.fa.fa-google-plus
                span Google+
              button.btn.btn-brand.btn-sm.btn-instagram(type='button', style='margin-bottom: 4px')
                i.fa.fa-instagram
                span Instagram
              button.btn.btn-brand.btn-sm.btn-pinterest(type='button', style='margin-bottom: 4px')
                i.fa.fa-pinterest
                span Pinterest
              button.btn.btn-brand.btn-sm.btn-vk(type='button', style='margin-bottom: 4px')
                i.fa.fa-vk
                span VK
              button.btn.btn-brand.btn-sm.btn-yahoo(type='button', style='margin-bottom: 4px')
                i.fa.fa-yahoo
                span Yahoo
              button.btn.btn-brand.btn-sm.btn-behance(type='button', style='margin-bottom: 4px')
                i.fa.fa-behance
                span Behance
              button.btn.btn-brand.btn-sm.btn-dropbox(type='button', style='margin-bottom: 4px')
                i.fa.fa-dropbox
                span Dropbox
              button.btn.btn-brand.btn-sm.btn-reddit(type='button', style='margin-bottom: 4px')
                i.fa.fa-reddit
                span Reddit
              button.btn.btn-brand.btn-sm.btn-spotify(type='button', style='margin-bottom: 4px')
                i.fa.fa-spotify
                span Spotify
              button.btn.btn-brand.btn-sm.btn-vine(type='button', style='margin-bottom: 4px')
                i.fa.fa-vine
                span Vine
              button.btn.btn-brand.btn-sm.btn-foursquare(type='button', style='margin-bottom: 4px')
                i.fa.fa-foursquare
                span Forsquare
              button.btn.btn-brand.btn-sm.btn-vimeo(type='button', style='margin-bottom: 4px')
                i.fa.fa-vimeo
                span Vimeo
            h6 Size Normal
            p
              button.btn.btn-brand.btn-facebook(type='button', style='margin-bottom: 4px')
                i.fa.fa-facebook
                span Facebook
              button.btn.btn-brand.btn-twitter(type='button', style='margin-bottom: 4px')
                i.fa.fa-twitter
                span Twitter
              button.btn.btn-brand.btn-linkedin(type='button', style='margin-bottom: 4px')
                i.fa.fa-linkedin
                span LinkedIn
              button.btn.btn-brand.btn-flickr(type='button', style='margin-bottom: 4px')
                i.fa.fa-flickr
                span Flickr
              button.btn.btn-brand.btn-tumblr(type='button', style='margin-bottom: 4px')
                i.fa.fa-tumblr
                span Tumblr
              button.btn.btn-brand.btn-xing(type='button', style='margin-bottom: 4px')
                i.fa.fa-xing
                span Xing
              button.btn.btn-brand.btn-github(type='button', style='margin-bottom: 4px')
                i.fa.fa-github
                span Github
              button.btn.btn-brand.btn-html5(type='button', style='margin-bottom: 4px')
                i.fa.fa-html5
                span HTML5
              button.btn.btn-brand.btn-openid(type='button', style='margin-bottom: 4px')
                i.fa.fa-openid
                span OpenID
              button.btn.btn-brand.btn-stack-overflow(type='button', style='margin-bottom: 4px')
                i.fa.fa-stack-overflow
                span StackOverflow
              button.btn.btn-brand.btn-css3(type='button', style='margin-bottom: 4px')
                i.fa.fa-css3
                span CSS3
              button.btn.btn-brand.btn-youtube(type='button', style='margin-bottom: 4px')
                i.fa.fa-youtube
                span YouTube
              button.btn.btn-brand.btn-dribbble(type='button', style='margin-bottom: 4px')
                i.fa.fa-dribbble
                span Dribbble
              button.btn.btn-brand.btn-google-plus(type='button', style='margin-bottom: 4px')
                i.fa.fa-google-plus
                span Google+
              button.btn.btn-brand.btn-instagram(type='button', style='margin-bottom: 4px')
                i.fa.fa-instagram
                span Instagram
              button.btn.btn-brand.btn-pinterest(type='button', style='margin-bottom: 4px')
                i.fa.fa-pinterest
                span Pinterest
              button.btn.btn-brand.btn-vk(type='button', style='margin-bottom: 4px')
                i.fa.fa-vk
                span VK
              button.btn.btn-brand.btn-yahoo(type='button', style='margin-bottom: 4px')
                i.fa.fa-yahoo
                span Yahoo
              button.btn.btn-brand.btn-behance(type='button', style='margin-bottom: 4px')
                i.fa.fa-behance
                span Behance
              button.btn.btn-brand.btn-dropbox(type='button', style='margin-bottom: 4px')
                i.fa.fa-dropbox
                span Dropbox
              button.btn.btn-brand.btn-reddit(type='button', style='margin-bottom: 4px')
                i.fa.fa-reddit
                span Reddit
              button.btn.btn-brand.btn-spotify(type='button', style='margin-bottom: 4px')
                i.fa.fa-spotify
                span Spotify
              button.btn.btn-brand.btn-vine(type='button', style='margin-bottom: 4px')
                i.fa.fa-vine
                span Vine
              button.btn.btn-brand.btn-foursquare(type='button', style='margin-bottom: 4px')
                i.fa.fa-foursquare
                span Forsquare
              button.btn.btn-brand.btn-vimeo(type='button', style='margin-bottom: 4px')
                i.fa.fa-vimeo
                span Vimeo
            h6
              | Size Large 
              small
                | Add this class 
                code .btn-lg
            p
              button.btn.btn-brand.btn-lg.btn-facebook(type='button', style='margin-bottom: 4px')
                i.fa.fa-facebook
                span Facebook
              button.btn.btn-brand.btn-lg.btn-twitter(type='button', style='margin-bottom: 4px')
                i.fa.fa-twitter
                span Twitter
              button.btn.btn-brand.btn-lg.btn-linkedin(type='button', style='margin-bottom: 4px')
                i.fa.fa-linkedin
                span LinkedIn
              button.btn.btn-brand.btn-lg.btn-flickr(type='button', style='margin-bottom: 4px')
                i.fa.fa-flickr
                span Flickr
              button.btn.btn-brand.btn-lg.btn-tumblr(type='button', style='margin-bottom: 4px')
                i.fa.fa-tumblr
                span Tumblr
              button.btn.btn-brand.btn-lg.btn-xing(type='button', style='margin-bottom: 4px')
                i.fa.fa-xing
                span Xing
              button.btn.btn-brand.btn-lg.btn-github(type='button', style='margin-bottom: 4px')
                i.fa.fa-github
                span Github
              button.btn.btn-brand.btn-lg.btn-html5(type='button', style='margin-bottom: 4px')
                i.fa.fa-html5
                span HTML5
              button.btn.btn-brand.btn-lg.btn-openid(type='button', style='margin-bottom: 4px')
                i.fa.fa-openid
                span OpenID
              button.btn.btn-brand.btn-lg.btn-stack-overflow(type='button', style='margin-bottom: 4px')
                i.fa.fa-stack-overflow
                span StackOverflow
              button.btn.btn-brand.btn-lg.btn-css3(type='button', style='margin-bottom: 4px')
                i.fa.fa-css3
                span CSS3
              button.btn.btn-brand.btn-lg.btn-youtube(type='button', style='margin-bottom: 4px')
                i.fa.fa-youtube
                span YouTube
              button.btn.btn-brand.btn-lg.btn-dribbble(type='button', style='margin-bottom: 4px')
                i.fa.fa-dribbble
                span Dribbble
              button.btn.btn-brand.btn-lg.btn-google-plus(type='button', style='margin-bottom: 4px')
                i.fa.fa-google-plus
                span Google+
              button.btn.btn-brand.btn-lg.btn-instagram(type='button', style='margin-bottom: 4px')
                i.fa.fa-instagram
                span Instagram
              button.btn.btn-brand.btn-lg.btn-pinterest(type='button', style='margin-bottom: 4px')
                i.fa.fa-pinterest
                span Pinterest
              button.btn.btn-brand.btn-lg.btn-vk(type='button', style='margin-bottom: 4px')
                i.fa.fa-vk
                span VK
              button.btn.btn-brand.btn-lg.btn-yahoo(type='button', style='margin-bottom: 4px')
                i.fa.fa-yahoo
                span Yahoo
              button.btn.btn-brand.btn-lg.btn-behance(type='button', style='margin-bottom: 4px')
                i.fa.fa-behance
                span Behance
              button.btn.btn-brand.btn-lg.btn-dropbox(type='button', style='margin-bottom: 4px')
                i.fa.fa-dropbox
                span Dropbox
              button.btn.btn-brand.btn-lg.btn-reddit(type='button', style='margin-bottom: 4px')
                i.fa.fa-reddit
                span Reddit
              button.btn.btn-brand.btn-lg.btn-spotify(type='button', style='margin-bottom: 4px')
                i.fa.fa-spotify
                span Spotify
              button.btn.btn-brand.btn-lg.btn-vine(type='button', style='margin-bottom: 4px')
                i.fa.fa-vine
                span Vine
              button.btn.btn-brand.btn-lg.btn-foursquare(type='button', style='margin-bottom: 4px')
                i.fa.fa-foursquare
                span Forsquare
              button.btn.btn-brand.btn-lg.btn-vimeo(type='button', style='margin-bottom: 4px')
                i.fa.fa-vimeo
                span Vimeo
      // /.col
      .col-12
        .card
          .card-header
            strong Brand Buttons
            small Only icons. Usage ex.
            code(style='text-transform:lowercase') <button class="btn btn-brand btn-facebook"><span>Facebook</span></button>
          .card-body
            h6
              | Size Small 
              small
                | Add this class 
                code .btn-sm
            p
              button.btn.btn-brand.btn-sm.btn-facebook(type='button', style='margin-bottom: 4px')
                i.fa.fa-facebook
              button.btn.btn-brand.btn-sm.btn-twitter(type='button', style='margin-bottom: 4px')
                i.fa.fa-twitter
              button.btn.btn-brand.btn-sm.btn-linkedin(type='button', style='margin-bottom: 4px')
                i.fa.fa-linkedin
              button.btn.btn-brand.btn-sm.btn-flickr(type='button', style='margin-bottom: 4px')
                i.fa.fa-flickr
              button.btn.btn-brand.btn-sm.btn-tumblr(type='button', style='margin-bottom: 4px')
                i.fa.fa-tumblr
              button.btn.btn-brand.btn-sm.btn-xing(type='button', style='margin-bottom: 4px')
                i.fa.fa-xing
              button.btn.btn-brand.btn-sm.btn-github(type='button', style='margin-bottom: 4px')
                i.fa.fa-github
              button.btn.btn-brand.btn-sm.btn-html5(type='button', style='margin-bottom: 4px')
                i.fa.fa-html5
              button.btn.btn-brand.btn-sm.btn-openid(type='button', style='margin-bottom: 4px')
                i.fa.fa-openid
              button.btn.btn-brand.btn-sm.btn-stack-overflow(type='button', style='margin-bottom: 4px')
                i.fa.fa-stack-overflow
              button.btn.btn-brand.btn-sm.btn-css3(type='button', style='margin-bottom: 4px')
                i.fa.fa-css3
              button.btn.btn-brand.btn-sm.btn-youtube(type='button', style='margin-bottom: 4px')
                i.fa.fa-youtube
              button.btn.btn-brand.btn-sm.btn-dribbble(type='button', style='margin-bottom: 4px')
                i.fa.fa-dribbble
              button.btn.btn-brand.btn-sm.btn-google-plus(type='button', style='margin-bottom: 4px')
                i.fa.fa-google-plus
              button.btn.btn-brand.btn-sm.btn-instagram(type='button', style='margin-bottom: 4px')
                i.fa.fa-instagram
              button.btn.btn-brand.btn-sm.btn-pinterest(type='button', style='margin-bottom: 4px')
                i.fa.fa-pinterest
              button.btn.btn-brand.btn-sm.btn-vk(type='button', style='margin-bottom: 4px')
                i.fa.fa-vk
              button.btn.btn-brand.btn-sm.btn-yahoo(type='button', style='margin-bottom: 4px')
                i.fa.fa-yahoo
              button.btn.btn-brand.btn-sm.btn-behance(type='button', style='margin-bottom: 4px')
                i.fa.fa-behance
              button.btn.btn-brand.btn-sm.btn-dropbox(type='button', style='margin-bottom: 4px')
                i.fa.fa-dropbox
              button.btn.btn-brand.btn-sm.btn-reddit(type='button', style='margin-bottom: 4px')
                i.fa.fa-reddit
              button.btn.btn-brand.btn-sm.btn-spotify(type='button', style='margin-bottom: 4px')
                i.fa.fa-spotify
              button.btn.btn-brand.btn-sm.btn-vine(type='button', style='margin-bottom: 4px')
                i.fa.fa-vine
              button.btn.btn-brand.btn-sm.btn-foursquare(type='button', style='margin-bottom: 4px')
                i.fa.fa-foursquare
              button.btn.btn-brand.btn-sm.btn-vimeo(type='button', style='margin-bottom: 4px')
                i.fa.fa-vimeo
            h6 Size Normal
            p
              button.btn.btn-brand.btn-facebook(type='button', style='margin-bottom: 4px')
                i.fa.fa-facebook
              button.btn.btn-brand.btn-twitter(type='button', style='margin-bottom: 4px')
                i.fa.fa-twitter
              button.btn.btn-brand.btn-linkedin(type='button', style='margin-bottom: 4px')
                i.fa.fa-linkedin
              button.btn.btn-brand.btn-flickr(type='button', style='margin-bottom: 4px')
                i.fa.fa-flickr
              button.btn.btn-brand.btn-tumblr(type='button', style='margin-bottom: 4px')
                i.fa.fa-tumblr
              button.btn.btn-brand.btn-xing(type='button', style='margin-bottom: 4px')
                i.fa.fa-xing
              button.btn.btn-brand.btn-github(type='button', style='margin-bottom: 4px')
                i.fa.fa-github
              button.btn.btn-brand.btn-html5(type='button', style='margin-bottom: 4px')
                i.fa.fa-html5
              button.btn.btn-brand.btn-openid(type='button', style='margin-bottom: 4px')
                i.fa.fa-openid
              button.btn.btn-brand.btn-stack-overflow(type='button', style='margin-bottom: 4px')
                i.fa.fa-stack-overflow
              button.btn.btn-brand.btn-css3(type='button', style='margin-bottom: 4px')
                i.fa.fa-css3
              button.btn.btn-brand.btn-youtube(type='button', style='margin-bottom: 4px')
                i.fa.fa-youtube
              button.btn.btn-brand.btn-dribbble(type='button', style='margin-bottom: 4px')
                i.fa.fa-dribbble
              button.btn.btn-brand.btn-google-plus(type='button', style='margin-bottom: 4px')
                i.fa.fa-google-plus
              button.btn.btn-brand.btn-instagram(type='button', style='margin-bottom: 4px')
                i.fa.fa-instagram
              button.btn.btn-brand.btn-pinterest(type='button', style='margin-bottom: 4px')
                i.fa.fa-pinterest
              button.btn.btn-brand.btn-vk(type='button', style='margin-bottom: 4px')
                i.fa.fa-vk
              button.btn.btn-brand.btn-yahoo(type='button', style='margin-bottom: 4px')
                i.fa.fa-yahoo
              button.btn.btn-brand.btn-behance(type='button', style='margin-bottom: 4px')
                i.fa.fa-behance
              button.btn.btn-brand.btn-dropbox(type='button', style='margin-bottom: 4px')
                i.fa.fa-dropbox
              button.btn.btn-brand.btn-reddit(type='button', style='margin-bottom: 4px')
                i.fa.fa-reddit
              button.btn.btn-brand.btn-spotify(type='button', style='margin-bottom: 4px')
                i.fa.fa-spotify
              button.btn.btn-brand.btn-vine(type='button', style='margin-bottom: 4px')
                i.fa.fa-vine
              button.btn.btn-brand.btn-foursquare(type='button', style='margin-bottom: 4px')
                i.fa.fa-foursquare
              button.btn.btn-brand.btn-vimeo(type='button', style='margin-bottom: 4px')
                i.fa.fa-vimeo
            h6
              | Size Large 
              small
                | Add this class 
                code .btn-lg
            p
              button.btn.btn-brand.btn-lg.btn-facebook(type='button', style='margin-bottom: 4px')
                i.fa.fa-facebook
              button.btn.btn-brand.btn-lg.btn-twitter(type='button', style='margin-bottom: 4px')
                i.fa.fa-twitter
              button.btn.btn-brand.btn-lg.btn-linkedin(type='button', style='margin-bottom: 4px')
                i.fa.fa-linkedin
              button.btn.btn-brand.btn-lg.btn-flickr(type='button', style='margin-bottom: 4px')
                i.fa.fa-flickr
              button.btn.btn-brand.btn-lg.btn-tumblr(type='button', style='margin-bottom: 4px')
                i.fa.fa-tumblr
              button.btn.btn-brand.btn-lg.btn-xing(type='button', style='margin-bottom: 4px')
                i.fa.fa-xing
              button.btn.btn-brand.btn-lg.btn-github(type='button', style='margin-bottom: 4px')
                i.fa.fa-github
              button.btn.btn-brand.btn-lg.btn-html5(type='button', style='margin-bottom: 4px')
                i.fa.fa-html5
              button.btn.btn-brand.btn-lg.btn-openid(type='button', style='margin-bottom: 4px')
                i.fa.fa-openid
              button.btn.btn-brand.btn-lg.btn-stack-overflow(type='button', style='margin-bottom: 4px')
                i.fa.fa-stack-overflow
              button.btn.btn-brand.btn-lg.btn-css3(type='button', style='margin-bottom: 4px')
                i.fa.fa-css3
              button.btn.btn-brand.btn-lg.btn-youtube(type='button', style='margin-bottom: 4px')
                i.fa.fa-youtube
              button.btn.btn-brand.btn-lg.btn-dribbble(type='button', style='margin-bottom: 4px')
                i.fa.fa-dribbble
              button.btn.btn-brand.btn-lg.btn-google-plus(type='button', style='margin-bottom: 4px')
                i.fa.fa-google-plus
              button.btn.btn-brand.btn-lg.btn-instagram(type='button', style='margin-bottom: 4px')
                i.fa.fa-instagram
              button.btn.btn-brand.btn-lg.btn-pinterest(type='button', style='margin-bottom: 4px')
                i.fa.fa-pinterest
              button.btn.btn-brand.btn-lg.btn-vk(type='button', style='margin-bottom: 4px')
                i.fa.fa-vk
              button.btn.btn-brand.btn-lg.btn-yahoo(type='button', style='margin-bottom: 4px')
                i.fa.fa-yahoo
              button.btn.btn-brand.btn-lg.btn-behance(type='button', style='margin-bottom: 4px')
                i.fa.fa-behance
              button.btn.btn-brand.btn-lg.btn-dropbox(type='button', style='margin-bottom: 4px')
                i.fa.fa-dropbox
              button.btn.btn-brand.btn-lg.btn-reddit(type='button', style='margin-bottom: 4px')
                i.fa.fa-reddit
              button.btn.btn-brand.btn-lg.btn-spotify(type='button', style='margin-bottom: 4px')
                i.fa.fa-spotify
              button.btn.btn-brand.btn-lg.btn-vine(type='button', style='margin-bottom: 4px')
                i.fa.fa-vine
              button.btn.btn-brand.btn-lg.btn-foursquare(type='button', style='margin-bottom: 4px')
                i.fa.fa-foursquare
              button.btn.btn-brand.btn-lg.btn-vimeo(type='button', style='margin-bottom: 4px')
                i.fa.fa-vimeo
      // /.col
      .col-12
        .card
          .card-header
            strong Brand Buttons
            small Only text. Usage ex.
            code(style='text-transform:lowercase') <button class="btn btn-brand btn-facebook text"><span>Facebook</span></button>
          .card-body
            h6
              | Size Small 
              small
                | Add this class 
                code .btn-sm
            p
              button.btn.btn-brand.btn-sm.btn-facebook(type='button', style='margin-bottom: 4px')
                span Facebook
              button.btn.btn-brand.btn-sm.btn-twitter(type='button', style='margin-bottom: 4px')
                span Twitter
              button.btn.btn-brand.btn-sm.btn-linkedin(type='button', style='margin-bottom: 4px')
                span LinkedIn
              button.btn.btn-brand.btn-sm.btn-flickr(type='button', style='margin-bottom: 4px')
                span Flickr
              button.btn.btn-brand.btn-sm.btn-tumblr(type='button', style='margin-bottom: 4px')
                span Tumblr
              button.btn.btn-brand.btn-sm.btn-xing(type='button', style='margin-bottom: 4px')
                span Xing
              button.btn.btn-brand.btn-sm.btn-github(type='button', style='margin-bottom: 4px')
                span Github
              button.btn.btn-brand.btn-sm.btn-html5(type='button', style='margin-bottom: 4px')
                span HTML5
              button.btn.btn-brand.btn-sm.btn-openid(type='button', style='margin-bottom: 4px')
                span OpenID
              button.btn.btn-brand.btn-sm.btn-stack-overflow(type='button', style='margin-bottom: 4px')
                span StackOverflow
              button.btn.btn-brand.btn-sm.btn-css3(type='button', style='margin-bottom: 4px')
                span CSS3
              button.btn.btn-brand.btn-sm.btn-youtube(type='button', style='margin-bottom: 4px')
                span YouTube
              button.btn.btn-brand.btn-sm.btn-dribbble(type='button', style='margin-bottom: 4px')
                span Dribbble
              button.btn.btn-brand.btn-sm.btn-google-plus(type='button', style='margin-bottom: 4px')
                span Google+
              button.btn.btn-brand.btn-sm.btn-instagram(type='button', style='margin-bottom: 4px')
                span Instagram
              button.btn.btn-brand.btn-sm.btn-pinterest(type='button', style='margin-bottom: 4px')
                span Pinterest
              button.btn.btn-brand.btn-sm.btn-vk(type='button', style='margin-bottom: 4px')
                span VK
              button.btn.btn-brand.btn-sm.btn-yahoo(type='button', style='margin-bottom: 4px')
                span Yahoo
              button.btn.btn-brand.btn-sm.btn-behance(type='button', style='margin-bottom: 4px')
                span Behance
              button.btn.btn-brand.btn-sm.btn-dropbox(type='button', style='margin-bottom: 4px')
                span Dropbox
              button.btn.btn-brand.btn-sm.btn-reddit(type='button', style='margin-bottom: 4px')
                span Reddit
              button.btn.btn-brand.btn-sm.btn-spotify(type='button', style='margin-bottom: 4px')
                span Spotify
              button.btn.btn-brand.btn-sm.btn-vine(type='button', style='margin-bottom: 4px')
                span Vine
              button.btn.btn-brand.btn-sm.btn-foursquare(type='button', style='margin-bottom: 4px')
                span Forsquare
              button.btn.btn-brand.btn-sm.btn-vimeo(type='button', style='margin-bottom: 4px')
                span Vimeo
            h6 Size Normal
            p
              button.btn.btn-brand.btn-facebook(type='button', style='margin-bottom: 4px')
                span Facebook
              button.btn.btn-brand.btn-twitter(type='button', style='margin-bottom: 4px')
                span Twitter
              button.btn.btn-brand.btn-linkedin(type='button', style='margin-bottom: 4px')
                span LinkedIn
              button.btn.btn-brand.btn-flickr(type='button', style='margin-bottom: 4px')
                span Flickr
              button.btn.btn-brand.btn-tumblr(type='button', style='margin-bottom: 4px')
                span Tumblr
              button.btn.btn-brand.btn-xing(type='button', style='margin-bottom: 4px')
                span Xing
              button.btn.btn-brand.btn-github(type='button', style='margin-bottom: 4px')
                span Github
              button.btn.btn-brand.btn-html5(type='button', style='margin-bottom: 4px')
                span HTML5
              button.btn.btn-brand.btn-openid(type='button', style='margin-bottom: 4px')
                span OpenID
              button.btn.btn-brand.btn-stack-overflow(type='button', style='margin-bottom: 4px')
                span StackOverflow
              button.btn.btn-brand.btn-css3(type='button', style='margin-bottom: 4px')
                span CSS3
              button.btn.btn-brand.btn-youtube(type='button', style='margin-bottom: 4px')
                span YouTube
              button.btn.btn-brand.btn-dribbble(type='button', style='margin-bottom: 4px')
                span Dribbble
              button.btn.btn-brand.btn-google-plus(type='button', style='margin-bottom: 4px')
                span Google+
              button.btn.btn-brand.btn-instagram(type='button', style='margin-bottom: 4px')
                span Instagram
              button.btn.btn-brand.btn-pinterest(type='button', style='margin-bottom: 4px')
                span Pinterest
              button.btn.btn-brand.btn-vk(type='button', style='margin-bottom: 4px')
                span VK
              button.btn.btn-brand.btn-yahoo(type='button', style='margin-bottom: 4px')
                span Yahoo
              button.btn.btn-brand.btn-behance(type='button', style='margin-bottom: 4px')
                span Behance
              button.btn.btn-brand.btn-dropbox(type='button', style='margin-bottom: 4px')
                span Dropbox
              button.btn.btn-brand.btn-reddit(type='button', style='margin-bottom: 4px')
                span Reddit
              button.btn.btn-brand.btn-spotify(type='button', style='margin-bottom: 4px')
                span Spotify
              button.btn.btn-brand.btn-vine(type='button', style='margin-bottom: 4px')
                span Vine
              button.btn.btn-brand.btn-foursquare(type='button', style='margin-bottom: 4px')
                span Forsquare
              button.btn.btn-brand.btn-vimeo(type='button', style='margin-bottom: 4px')
                span Vimeo
            h6
              | Size Large 
              small
                | Add this class 
                code .btn-lg
            p
              button.btn.btn-brand.btn-lg.btn-facebook(type='button', style='margin-bottom: 4px')
                span Facebook
              button.btn.btn-brand.btn-lg.btn-twitter(type='button', style='margin-bottom: 4px')
                span Twitter
              button.btn.btn-brand.btn-lg.btn-linkedin(type='button', style='margin-bottom: 4px')
                span LinkedIn
              button.btn.btn-brand.btn-lg.btn-flickr(type='button', style='margin-bottom: 4px')
                span Flickr
              button.btn.btn-brand.btn-lg.btn-tumblr(type='button', style='margin-bottom: 4px')
                span Tumblr
              button.btn.btn-brand.btn-lg.btn-xing(type='button', style='margin-bottom: 4px')
                span Xing
              button.btn.btn-brand.btn-lg.btn-github(type='button', style='margin-bottom: 4px')
                span Github
              button.btn.btn-brand.btn-lg.btn-html5(type='button', style='margin-bottom: 4px')
                span HTML5
              button.btn.btn-brand.btn-lg.btn-openid(type='button', style='margin-bottom: 4px')
                span OpenID
              button.btn.btn-brand.btn-lg.btn-stack-overflow(type='button', style='margin-bottom: 4px')
                span StackOverflow
              button.btn.btn-brand.btn-lg.btn-css3(type='button', style='margin-bottom: 4px')
                span CSS3
              button.btn.btn-brand.btn-lg.btn-youtube(type='button', style='margin-bottom: 4px')
                span YouTube
              button.btn.btn-brand.btn-lg.btn-dribbble(type='button', style='margin-bottom: 4px')
                span Dribbble
              button.btn.btn-brand.btn-lg.btn-google-plus(type='button', style='margin-bottom: 4px')
                span Google+
              button.btn.btn-brand.btn-lg.btn-instagram(type='button', style='margin-bottom: 4px')
                span Instagram
              button.btn.btn-brand.btn-lg.btn-pinterest(type='button', style='margin-bottom: 4px')
                span Pinterest
              button.btn.btn-brand.btn-lg.btn-vk(type='button', style='margin-bottom: 4px')
                span VK
              button.btn.btn-brand.btn-lg.btn-yahoo(type='button', style='margin-bottom: 4px')
                span Yahoo
              button.btn.btn-brand.btn-lg.btn-behance(type='button', style='margin-bottom: 4px')
                span Behance
              button.btn.btn-brand.btn-lg.btn-dropbox(type='button', style='margin-bottom: 4px')
                span Dropbox
              button.btn.btn-brand.btn-lg.btn-reddit(type='button', style='margin-bottom: 4px')
                span Reddit
              button.btn.btn-brand.btn-lg.btn-spotify(type='button', style='margin-bottom: 4px')
                span Spotify
              button.btn.btn-brand.btn-lg.btn-vine(type='button', style='margin-bottom: 4px')
                span Vine
              button.btn.btn-brand.btn-lg.btn-foursquare(type='button', style='margin-bottom: 4px')
                span Forsquare
              button.btn.btn-brand.btn-lg.btn-vimeo(type='button', style='margin-bottom: 4px')
                span Vimeo
      // /.col
    // /.row
